next
Round
Technologies
Experiences
Contribute
Login
next
Round
Technologies
Experiences
Contribute
Login
Question Loading...
Pseudo classes
1. What is a pseudo-class in CSS?
Level: Expert | Frequency: High
2. How are pseudo-classes different from pseudo-elements?
Level: Expert | Frequency: High
3. What is the syntax of a pseudo-class in CSS?
Level: Expert | Frequency: High
4. Give some commonly used pseudo-classes.
Level: Expert | Frequency: High
5. What does the :hover pseudo-class do?
Level: Expert | Frequency: High
6. What’s the purpose of the :active pseudo-class?
Level: Expert | Frequency: High
7. How does the :visited pseudo-class work for links?
Level: Expert | Frequency: High
8. What is the :focus pseudo-class used for?
Level: Expert | Frequency: High
9. What does the :checked pseudo-class do?
Level: Expert | Frequency: High
10. How does the :disabled pseudo-class behave?
Level: Expert | Frequency: High
11. What is the difference between :first-child and :first-of-type?
Level: Expert | Frequency: High
12. How do :nth-child() and :nth-of-type() differ?
Level: Expert | Frequency: High
13. How do you select every odd or even element using pseudo-classes?
Level: Expert | Frequency: High
14. How can you style an element when it’s being hovered over along with its child?
Level: Expert | Frequency: High
15. What does the :not() pseudo-class do?
Level: Expert | Frequency: High
16. How can you use multiple pseudo-classes together?
Level: Expert | Frequency: High
17. What is the difference between :link and :visited?
Level: Expert | Frequency: High
18. What does the :target pseudo-class represent?
Level: Expert | Frequency: High
19. How can you use :empty to detect empty elements?
Level: Expert | Frequency: High
20. How does the :root pseudo-class differ from the html selector?
Level: Expert | Frequency: High
21. What does the :valid and :invalid pseudo-class do?
Level: Expert | Frequency: High
22. How can you use :required and :optional pseudo-classes in forms?
Level: Expert | Frequency: High
23. What is the use of :in-range and :out-of-range?
Level: Expert | Frequency: High
24. What does :read-only and :read-write do?
Level: Expert | Frequency: High
25. How can you style an input field when it’s autofilled?
Level: Expert | Frequency: High
26. How does the :focus-within pseudo-class work?
Level: Expert | Frequency: High
27. What’s the difference between :focus and :focus-visible?
Level: Expert | Frequency: High
28. What is the purpose of the :placeholder-shown pseudo-class?
Level: Expert | Frequency: High
29. How can you style a checkbox when it is checked or unchecked?
Level: Expert | Frequency: High
30. How can you style invalid form inputs without JavaScript?
Level: Expert | Frequency: High
31. Can pseudo-classes be chained together? Give an example.
Level: Expert | Frequency: High
32. What is the specificity of pseudo-classes compared to normal selectors?
Level: Expert | Frequency: High
33. How can you use :not() effectively to exclude elements from styling?
Level: Expert | Frequency: High
34. How does :has() pseudo-class work, and why is it powerful?
Level: Expert | Frequency: High
35. Is :has() supported in all browsers?
Level: Expert | Frequency: High
36. How does :is() differ from :where() in terms of specificity?
Level: Expert | Frequency: High
37. How can you combine :is() or :where() with other selectors for cleaner code?
Level: Expert | Frequency: High
38. What’s the difference between :nth-child() and :nth-last-child()?
Level: Expert | Frequency: High
39. How can you style only the last element of a list using pseudo-classes?
Level: Expert | Frequency: High
40. What does the :lang() pseudo-class do?
Level: Expert | Frequency: High
41. How do you change a button’s color when hovered but not when disabled?
Level: Expert | Frequency: High
42. How can you highlight the current section in a menu using :target?
Level: Expert | Frequency: High
43. How can you style a form field differently when focused and valid?
Level: Expert | Frequency: High
44. How do you style every third list item differently?
Level: Expert | Frequency: High
45. How can you style alternate table rows without adding extra classes?
Level: Expert | Frequency: High
46. How do you hide empty <p> tags using pseudo-classes?
Level: Expert | Frequency: High
47. How can you style the parent when any child inside it is focused?
Level: Expert | Frequency: High
48. How can you highlight a link only when it’s both focused and hovered?
Level: Expert | Frequency: High
49. How can you style the first letter of only the first paragraph using pseudo-classes?
Level: Expert | Frequency: High
50. How would you use :has() to select a <div> that contains an image?
Level: Expert | Frequency: High
All Topics
Basics
Selectors
Box model
Text formatters
Postioning
Display
Pseudo classes
Pseudo elements
Flexbox
Grid
Display
Combinators
Overflow
Breakpoint
Transformation and Transition
Frameworks
Everything else